<%@ page language="java" contentType="text/html; charset=UTF-8"  pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<% 
	String path=request.getContextPath(); 
	String basePath=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
	request.setAttribute("basePath", basePath);
%>
<!DOCTYPE html>
<html>
<head>
	<title>Checkout</title>
	<link href="${basePath}view/css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
	<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
	<script src="${basePath}view/js/jquery.min.js"></script>
	<!-- Custom Theme files -->
	<!--theme-style-->
	<link href="${basePath}view/css/style.css" rel="stylesheet" type="text/css" media="all" />	
	<!--//theme-style-->
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="keywords" content="Fashion Mania Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template, 
	Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
	<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
	<!-- start menu -->
	<link href="${basePath}view/css/memenu.css" rel="stylesheet" type="text/css" media="all" />
	<script type="text/javascript" src="${basePath}view/js/memenu.js"></script>
	<script>$(document).ready(function(){$(".memenu").memenu();});</script>
	<script src="${basePath}view/js/simpleCart.min.js"> </script>
	<!-- slide -->
</head>
<body>
	<!-- header -->
	<div class="header">
		<div class="header-top">
			<div class="container">
				<div class="col-sm-4 world"></div>
				<div class="col-sm-4 logo">
					<a href="${basePath}index.jsp"><img src="${basePath}view/image/logo.png" alt=""></a>	
				</div>
				<div class="col-sm-4 header-left">
						<c:if test="${empty LoginUserName}">
							<p class="log">
								<a href="${basePath}view/login.jsp">Login</a>
								<span>or</span>
								<a href="${basePath}view/register.jsp">Sign&nbsp;Up</a>
							</p>
							<div class="cart box_1"></div>
							<div class="clearfix"></div>
						</c:if>
						<c:if test="${not empty LoginUserName}">
							<p class="log">
								<a href="${basePath}index.jsp">你好:${LoginUserName}!</a>
								<span>or</span>
								<a href="${basePath}user/exit.do">Exit</a>
							</p>
							<div class="cart box_1">
								<div class="total">
									<h3> 
										<a href="${basePath}view/shoppingCart.jsp">
											<img src="${basePath}view/images/cart.png" alt=""/>
										</a>
									</h3>
								</div>
								<p><a href="javascript:void(0);" onclick="clearCart()" class="simpleCart_empty">Empty Cart</a></p>
							</div>
							<div class="clearfix"> </div>
						</c:if>
				</div>
				<div class="clearfix"> </div>
			</div>
		</div>
	</div>
	<!-- //header -->
<!---->
<div class="container">
	<div class="check-out">
	<h1>Checkout</h1>
	<c:if test="${empty LoginUserName}">
		<h3 style="width:500px;margin-left:auto;margin-right:auto;color:red;">亲...您还没有登录哟，您可以先去登录！</h3>
	</c:if>
	<c:if test="${not empty LoginUserName}">
		<c:if test="${empty cart || empty cart.cartItems }">
			<h3 style="width:500px;margin-left:auto;margin-right:auto;color:red;">亲...购物车没有东西哟，您可以先去购物！</h3>
		</c:if>
	</c:if>
	<c:if test="${not empty cart.cartItems }">
	    <table >
			  <tr>
				<th>Item</th>
				<th>Qty</th>		
				<th>Prices</th>
				<th>Size</th>
				<th>Subtotal</th>
				<th>Delete</th>
			  </tr>
			  <c:forEach items="${cart.cartItems}" var="ci">
				  <tr>
					<td class="ring-in"><a href="${basePath}index.jsp" class="at-in"><img src="${basePath}view/${ci.product.pimage}" class="img-responsive" alt=""></a>
					<div class="sed">
						<h5>${ci.product.pname}</h5>
						<p>${ci.product.pdesc}</p>
					</div>
					<div class="clearfix"> </div></td>
					<td class="check"><input type="text" value="${ci.count}" readonly="readonly" ></td>		
					<td>&yen;${ci.product.price}</td>
					<td>small</td>
					<td>${ci.subtotal}</td>
					<td><a href="javascript:void(0);" onclick="removeCart('${ci.product.pid}')" class="to-buy">delete</a></td>
				  </tr>
			  </c:forEach>
			  <tr>
			  	<th>&nbsp;</th>
			  </tr>
			  <tr>
			  	<th>Total:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:red;">&yen;${cart.total}</span></th>
			  </tr>
		</table>
		<a href="#" class="to-buy">PROCEED TO BUY</a>
	</c:if>
	<div class="clearfix"> </div>
    </div>
</div>
</body>
	<script type="text/javascript">
		function removeCart(pid){
			if(confirm("您确定要删除吗？")){
				location.href="${basePath}cart/remove.do?pid=" + pid;
			}
		}
		
		function clearCart(){
			if(confirm("您确定要清空购物车吗？")){
				location.href="${basePath}cart/clear.do";
			}
		}
	</script>
</html>